<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>javascript 阶段</title>
</head>
<body>

    <script>
            // 传值和传地址
            // 基本数据类型和引用数据类型

            // 复杂的书结构：
                // 数组嵌套对象
                // 对象嵌套数组
                    // 数组
                    var arr2 = [{color:"red"},{color:"green"},{color:"blue"},"orange"]
                    // 对象
                    var point = {
                        msg:"中心坐标",
                        result: [100, 200, "pink",["内容"]]
                    }

            // 这种数据结构就不能使用浅拷贝的逻辑复制数据

            // 深拷贝：
                    // 复制数据的时候，会深层次的复制，每一层数据都需要判断数据类型
                    // 如果是基本数据类型，那么就直接赋值
                    // 如果是引用数据类型，那么就继续执行递归函数，进行深层次的复制，直到复制的数据为基本数据类型为止

             
            // 编码实现：
            function deepCopy(elements){ // elements 是形参，代表需要复制的集合
                // 判断当前的数据集合是数组，还是对象
                var newData = Array.isArray(elements) == true ? [] : {};
                // 循环数据集合
                for(var key in elements){
                    // 判断复制的数据是何种数据类型
                    if(typeof elements[key] === "object" ){ // object 说明这是引用数据类型 [] {}
                        // 复制数据，通过递归实现深层次的复制
                        // 左侧是新数据 = 待复制的数据
                        newData[key] = deepCopy(elements[key]);
                                    
                    } else {
                        // 执行的传值（复制基本数据类型的数据）
                        // 复制数据，直接赋值
                        // newData["msg"] = "中心坐标"
                        newData[key] = elements[key];
                    }
                }
                // 循环结束了，方可得到拷贝的新数据
                // 返回新数据
                return newData;
            }

            // 拷贝 point
            var obj2 = deepCopy(point)
            // 修改新集合的数据
            obj2.result[2] = "粉色";
            console.log(point); // 原数据（不受影响）
            console.log(obj2);  // 新数据



            // 以下代表两个引用地址
            // var o1 = {}
            // var o2 = {}


            var arr1 = [{color : "red" } , {color :  "yellow"} , {color : "blue"} , "orange"];
            var arr3 = {
                msg : "中心坐标" ,
                result : [100 , 200 , "pink" , ["内容"]]
            }

            function deepCopy1(elements) {
                var addData = Array.isArray(elements) == true ? [] : {} ;
                for(var key in elements) {
                    if(typeof elements[key] === "object") {
                        addData[key] = deepCopy1(elements[key]);
                    }else {
                        addData[key] = elements[key];
                    }
                }
                return addData;
            }

            var obt = deepCopy1(arr3) ;
            obt. result[2] = "red";
            console.log(obt);
            console.log(arr3);
            
       

    </script>
</body>
</html>